import "https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"; //引入第三方的类库

//jquery下面的方法
//1.html():类似于js里面的innerHTML，读写元素对象里面的内容。
//2.val():类似于js里面的value，读写表单元素对象里面的值。

//表单验证 + 重名检测 + 发送数据给后端(无需js)

function reg() {
    const registry_form = $('.registry_form'); //form表单
    const checkspans = $('.checkspan'); //报错span元素
    const tel = $('.telnumber');
    const password = $('.password');
    let passflag = true;
    let telflag = true;
    //4.手机号码
    tel.on('focus', function() {
        checkspans.eq(0).css('color', '#333').html('请输入11位手机号码')
    });
    tel.on('blur', function() {
            if ($(this).val() !== '') {
                let reg = /^1[3456789]\d{9}$/;
                if (reg.test($(this).val())) {
                    $.ajax({
                        type: 'post',
                        url: 'http://10.31.155.14:81/2104_me/nike/php/registry.php',
                        data: {
                            telq: $(this).val()
                        }
                    }).done(function(data) { //data:后端返回匹配的结果
                        if (data === 'false') {
                            checkspans.eq(0).css('color', 'green').html('√');
                            telflag = true;
                        } else {
                            checkspans.eq(0).css('color', 'red').html('手机号已存在');
                            telflag = false;
                        }
                    });
                } else {
                    checkspans.eq(0).css('color', 'red').html('手机号码格式有误');
                    telflag = false;
                }
            } else {
                checkspans.eq(0).css('color', 'red').html('手机号码不能为空');
                telflag = false;
            }
        })
        //2.密码
    password.on('focus', function() {
        checkspans.eq(1).css('color', '#333').html('请输入6-12位的密码');
    });
    // oninput:文本框的内容发生改变
    // 判断弱中强
    password.on('input', function() {
        let reg1 = /[0-9]+/;
        let reg2 = /[a-z]+/;
        let reg3 = /[A-Z]+/;
        let reg4 = /[\W_]+/; //特殊字符
        let num = 0; //统计字符的种类
        if (reg1.test($(this).val())) {
            num++;
        }
        if (reg2.test($(this).val())) {
            num++;
        }
        if (reg3.test($(this).val())) {
            num++;
        }
        if (reg4.test($(this).val())) {
            num++;
        }

        switch (num) {
            case 1:
                checkspans.eq(1).css('color', 'red').html('弱');
                passflag = false;
                break;
            case 2:
            case 3:
                checkspans.eq(1).css('color', 'orange').html('中');
                passflag = true;
                break;
            case 4:
                checkspans.eq(1).css('color', 'green').html('强');
                passflag = true;
                break;
        }
    });
    password.on('blur', function() {
        if ($(this).val() !== '') { //密码不为空
            if ($(this).val().length >= 6 && $(this).val().length <= 12) { //长度正确
                if (passflag) { //标记成立
                    checkspans.eq(1).css('color', 'green').html('√');
                    passflag = true;
                }
            } else {
                checkspans.eq(1).css('color', 'red').html('密码长度不正确');
                passflag = false;
            }
        } else {
            checkspans.eq(1).css('color', 'red').html('密码不能为空');
            passflag = false;
        }
    });
    //5.阻止form+submit提交
    //onsubmit事件：表单提交,由form触发的
    registry_form.on('submit', function() {
        if (telnumber.val() === '') {
            checkspans.eq(0).css('color', 'red').html('手机号码不能为空');
            telflag = false;
        }
        if (password.val() === '') {
            checkspans.eq(1).css('color', 'red').html('密码不能为空');
            passflag = false;
        }
        if (!passflag || !telflag) {
            return false;
        }
    });
}
export {
    reg
}